@extends('admin.common')

@section('warp_head')
    <h1>
        会员统计
        <small>{{ $title }}</small>
    </h1>

    <ol class="breadcrumb" style="margin-right: 30px;">
        <li><a href="{{ admin_url('/') }}"><i class="fa fa-dashboard"></i> Home</a></li>
    </ol>
@endsection

@section('warp_content')
    <div class="box">
        <div class="box-header">

            <h3 class="box-title"></h3>

            <div class="pull-right">
                <style>
                    .form-group { margin-bottom: 5px!important;}
                    .input-group-height {line-height: 38px;}
                </style>
                <form action="" method="get" pjax-container="">
                    <div class="row modal-body" style="padding-top: 0px;">
                        <div class="form">
                            <div class="row" style="padding: 0 15px;">
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <div class="form-group">
                                            <label>日期</label>
                                            <div class="input-group date">
                                                <div class="input-group-addon">
                                                    <i class="fa fa-calendar"></i>
                                                </div>
                                                <input type="text" class="form-control pull-right" id="datepicker" name="date">
                                            </div>
                                        </div>
                                    </div>
                                </div>
                            </div>
                            <div class="row" style="padding: 0 15px;">
                                <div class="col-sm-2">
                                    <div class="form-group">
                                        <label for=""></label>
                                        <div class="input-group input-group-height ">
                                            <button type="submit" class="btn btn-primary submit">提交</button>&nbsp;
                                            <a href="" class="btn btn-facebook"><i class="fa fa-undo"></i>&nbsp;&nbsp;重置</a>
                                        </div>
                                    </div>
                                </div>
                            </div>
                        </div>
                    </div>
                </form>
            </div>
        </div>
        <div class="box-body table-responsive no-padding">

            <div class="col-sm-10" style="margin: 0 auto;">

                <canvas id="chart" class="chartjs" width="640px" height="240px"></canvas>

                <script>
                    $(function () {
                        var _x = "{{ $x_axis }}";
                        var _y = "{{ $y_axis }}";
                        var _y2 = "{{ $y_axis2 }}";
                        var name = "{{ $name }}";
                        var name2 = "{{ $name2 }}";
                        if(_y2 != 0 && name2 != 0){
                            var myChart = new Chart(document.getElementById("chart"),{
                                type:"line",
                                data:{
                                    labels: _x.split(','),
                                    datasets:[{
                                        label:name,
                                        data: _y.split(','),
                                        fill:false,
                                        borderColor:"rgb(255, 12, 92)",
                                        lineTension:0.1,
                                        borderColor: '#F07',
                                    },
                                        {
                                            label:name2,
                                            data: _y2.split(','),
                                            fill:false,
                                            borderColor:"rgb(75, 192, 192)",
                                            lineTension:0.1,
                                            borderColor: '#7CB7EF',
                                        }],
                                },
                                options:{

                                },
                            });
                        }else{
                            var myChart = new Chart(document.getElementById("chart"),{
                                type:"line",
                                data:{
                                    labels: _x.split(','),
                                    datasets:[{
                                        label:name,
                                        data: _y.split(','),
                                        fill:false,
                                        borderColor:"rgb(75, 192, 192)",
                                        lineTension:0.1,
                                        borderColor: '#7CB7EF',
                                    }],
                                },
                                options:{

                                },
                            });
                        }
                    });
                </script>

            </div>

        </div>

    </div>
@endsection

@section('script')
    <script>
        window.onload = function(){
            var source = $('#source').val();
            if(source == '/') {
                window.location.reload();
            }
        };
        $(function () {
            var url = window.location.href.split("?");
            $(".btn-facebook").attr("href",url[0] + "?_pjax=%23pjax-container");
            $(function() {
                $( "#datepicker" ).datepicker({
                    showOtherMonths: true,
                    selectOtherMonths: true,
                    format:'yyyy/mm/dd'
                });
                $("form").attr("action",window.location.href + "?_pjax=%23pjax-container");
            });
        })
    </script>
@endsection